var ccSlideShow = function (setting) {
    let st = setting;
    let mainElemet = document.getElementById('slide-show-cc');


    /* 生成元素 */
    setBTNElement();
    setSlideShowElement(st.imgs);

    /* 插入左右按钮 */
    function setBTNElement() {
        let goPreBTN = `<svg t="1610500729379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
    p-id="6494" width="128" height="128">
    <path
        d="M641.28 278.613333l-45.226667-45.226666-278.634666 278.762666 278.613333 278.485334 45.248-45.269334-233.365333-233.237333z"
        p-id="6495" fill="#bfbfbf"></path>
</svg>`;
        let goNextBTN = `<svg t="1610500756097" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="6759" width="128" height="128">
<path
    d="M593.450667 512.128L360.064 278.613333l45.290667-45.226666 278.613333 278.762666L405.333333 790.613333l-45.226666-45.269333z"
    p-id="6760" fill="#bfbfbf"></path>
</svg>`;

        let goPreElement = document.createElement('a');
        goPreElement.className = 'btn-ss';
        goPreElement.id = 'goPre-ss';
        goPreElement.innerHTML = goPreBTN;
        let goNextElement = document.createElement('a');
        goNextElement.className = 'btn-ss';
        goNextElement.id = 'goNext-ss';
        goNextElement.innerHTML = goNextBTN;

        mainElemet.appendChild(goPreElement);
        mainElemet.appendChild(goNextElement);
    }
    /* 插入轮播图List */
    function setSlideShowElement(imgs) {
        let ulElement = document.createElement('ul');
        ulElement.id = 'items-ss';

        for (let index = 0; index < imgs.length; index++) {
            const element = imgs[index];
            let tempLi = createLiElement(element);
            ulElement.appendChild(tempLi);
        }

        mainElemet.appendChild(ulElement);
    }


    function createLiElement(srcTemp) {
        let liElement = document.createElement('li');
        liElement.className = 'item-ss';
        let imgElement = `<img src="` + srcTemp + `" alt="">`;
        liElement.innerHTML = imgElement;
        return liElement;
    }

    /* 兼容性问题优化 */
    function onLoadFunc() {
        setStyle();
        goNext();
        autoSlide();
    }

    function onResizeFunc() {
        setStyle();
    }

    addLoadEvent(onLoadFunc);
    addResizeEvent(onResizeFunc);

    function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != 'function') {
            window.onload = func;
        } else {
            window.onload = function () {
                oldonload();
                func();
            }
        }
    }

    function addResizeEvent(func) {
        var oldonresize = window.onresize;
        if (typeof window.onresize != 'function') {
            window.onresize = func;
        } else {
            window.onresize = function () {
                oldonresize();
                func();
            }
        }
    }


    let slideTime = st.time;
    let timeStack = 0;


    function autoSlide(){
        if (st.auto == true) {
            setInterval(() => {
                timeStack++;
                if (timeStack == slideTime) {
                    goNext();
                    timeStack = 0;
                }
            }, 100);
        }
    }



    let imgList = document.querySelectorAll('.item-ss > img');
    let ulElement = document.querySelector('#items-ss');
    let liElements = document.querySelectorAll('.item-ss');
    let preBTN = document.getElementById('goPre-ss');
    let nextBTN = document.getElementById('goNext-ss');
    let BTNs = document.querySelectorAll('.btn-ss');

    let autoIndex = 0;
    let maxIndex = st.imgs.length - 1;


    /* 
     * 
     * 翻页逻辑区
     * 
     */

    function goNext() {
        circleIndexNext(maxIndex);
        for (let index = 0; index < liElements.length; index++) {
            const element = liElements[index];
            element.className = 'item-ss';
        }
        liElements[autoIndex].className = 'item-ss active';
    }

    function goPre() {
        circleIndexPre(maxIndex);
        for (let index = 0; index < liElements.length; index++) {
            const element = liElements[index];
            element.className = 'item-ss';
        }
        liElements[autoIndex].className = 'item-ss active';
    }

    function circleIndexNext(e) {
        if (autoIndex == e) {
            autoIndex = 0;
        } else {
            autoIndex++;
        }
    }

    function circleIndexPre(e) {
        if (autoIndex == 0) {
            autoIndex = e;
        } else {
            autoIndex--;
        }
    }


    preBTN.addEventListener("click", () => {
        timeStack = 0;
        goPre();
    });
    nextBTN.addEventListener("click", () => {
        timeStack = 0;
        goNext();
    });










    /* 
     *  设置Style样式区
     */

    function setStyle() {
        function getSize() {
            let elementHeight;
            let elementWidth;
            if (typeof st.marginTop == 'undefined') {
                elementWidth = document.documentElement.clientWidth;
                elementHeight = document.documentElement.clientHeight;
            } else {
                elementWidth = document.documentElement.clientWidth;
                elementHeight = document.documentElement.clientHeight - parseFloat(st.marginTop);
            }
            return [elementWidth, elementHeight];

        }


        let fullWidth = getSize()[0];
        let fullHeight = getSize()[1];

        /* 设置轮播图满屏 */
        ulElement.style.height = fullHeight + 'px';

        for (let index = 0; index < imgList.length; index++) {
            const element = imgList[index];

            /* 设置横宽满屏 */
            element.style.width = fullWidth + 'px';
            let imgHeight = element.height;

            /* 设置图片垂直居中 */
            if ((fullHeight - imgHeight) > 0) {
                let marginHeight = (fullHeight - imgHeight) / 2;
                element.style.marginTop = marginHeight + 'px';
            } else if ((imgHeight - fullHeight) > 0) {
                let marginHeight = (imgHeight - fullHeight) / 2;
                element.style.marginTop = -marginHeight + 'px';
            }
        }

        /* 设置按钮样式 */
        let goBTNs = document.querySelectorAll('.btn-ss > svg');

        for (let index = 0; index < goBTNs.length; index++) {
            const element = goBTNs[index];
            setBTN(element);
        }

        function setBTN(btn) {
            let btnHeight = (fullHeight - 4) + 'px';
            let btnWidth = fullWidth / 12 + 'px';
            btn.style.height = btnHeight;
            btn.style.width = btnWidth;
        }


        setMarginTop();

        function setMarginTop() {
            if (typeof st.marginTop != 'undefined') {
                mainElemet.style.marginTop = st.marginTop;
                for (let index = 0; index < BTNs.length; index++) {
                    const element = BTNs[index];
                    element.style.top = st.marginTop;
                }
            }
        }

    }





}